<div class="layui-card">
    <div class="layui-card-header">
        <span class="layui-breadcrumb pull-right">
            <a href="#!console">首页</a>
            <a><cite>注册量</cite></a>
        </span>
    </div>
    <div class="layui-card-body">
        <form class="layui-form toolbar">
            搜索:
            起始:
            <div class="layui-inline">
                <input type="text" class="layui-input time" id="startTimeR">
            </div>
            结束:
            <div class="layui-inline">
                <input type="text" class="layui-input time" id="endTimeR">
            </div>
            <button id="loginRegister-btn-search" class="layui-btn icon-btn"><i class="layui-icon">&#xe615;</i>搜索</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </form>
        <!-- 数据表格 -->
        <table class="layui-table" id="loginRegister-table" lay-filter="loginRegister-table"> </table>
    </div>
</div>
<script>
    layui.use(['config','table', 'laydate','util'], function () {
        var table = layui.table;
        var laydate = layui.laydate;
        var config = layui.config;
        var util = layui.util;
        // 渲染表格
        table.render({
            elem: '#loginRegister-table',
            url: config.base_server + 'api-select/loginRegister',
            where: {
                access_token: config.getToken().access_token
            },
            page: true,
            cols: [[
                { field: 'id', sort: true, title: '玩家ID' }
                , {
                    field: 'logoutOn', sort: true, templet: function (d) {
                        return util.toDateString(d.createdOn);
                    }, title: '注册时间'
                }
            ]]
        });
        //日期时间选择器
        laydate.render({
            elem: '#startTimeR' //指定元素
            , type: 'datetime'
            , format: 'yyyy-MM-dd HH:mm:ss'
            , max: 1
        });
        laydate.render({
            elem: '#endTimeR' //指定元素
            , type: 'datetime'
            , format: 'yyyy-MM-dd HH:mm:ss'
            , max: 1
        });

        // 搜索按钮点击事件
        $('#loginRegister-btn-search').click(function () {
            var start = $('#startTimeR').val();
            var end = $('#endTimeR').val();
            table.reload('loginRegister-table', { where: { startTimeR: start, endTimeR: end } });
        });
    });

</script>